<style lang="less">
    @import '../../assets/css/table.less';
    @import '../../assets/css/common.less';
</style>
<template>
    <div>
      <Row :gutter="10">
        <Form v-model="formValidate"  ref="formValidate" :label-width="120">
            <FormItem label="新密码" prop="password">
                <Input v-model="formValidate.password" placeholder="请输入新密码" style='width:200px'/>
            </FormItem>
            <FormItem>
                <Button type="primary" @click="handleSubmit()" style="width: 90px;height: 35px;border-radius: 0;font-size: 14px;">提交</Button>
            </FormItem>
        </Form>
      </Row>
    </div>
</template>
<script>
    import {modifyPassword} from '@/api/main'
    export default {
        data() {
            return {
                formValidate: {
                    password: '',
                },
            }
        },
        methods: {
            handleSubmit() {
                let _this = this
                if (_this.formValidate.password == '') {
                  _this.$Message.error('请输入密码');return;
                }
                modifyPassword(this.formValidate).then(res => {
                    if (res.code === 0) {
                        _this.$Message.success('操作成功')
                        localStorage.setItem('user', '')
                        this.$router.push({
                            name: 'login',
                        })
                    } else {
                        _this.$Message.error(res.text)
                    }
                })
            },
        },
        mounted() {

        },
    }
</script>
<style lang="less" scoped>
    .form_red_label{
        position: relative;
        &:before {
            content: '*';
            font-size: 20px;
            color: #FF4C53;
            border-radius: 50%;
            position: absolute;
            top: 4px;
            left: 37px;
            display: block;
        }
    }
</style>
<style lang="less">
    .demo-upload-list {
        display: inline-block;
        text-align: center;
        border-radius: 4px;
        overflow: hidden;
        background: #fff;
        position: relative;
    }

    .demo-upload-list img {
        width: 100%;
        height: 100%;
    }

    .demo-upload-list-cover {
        display: none;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(0, 0, 0, 0.6);
    }

    .demo-upload-list:hover .demo-upload-list-cover {
        display: block;
    }

    .demo-upload-list-cover i {
        color: #fff;
        font-size: 20px;
        cursor: pointer;
        margin: 40px 6px;
    }

    p.prompt {
        color: #dddee1;
    }

    .btn_right {
        width: 1%;
        margin-left: -25px
    }

    .special_check {
        width: 22%;
        height: 30px;
        margin-left: 10px;
        display: inline-block;
        padding-left: 1%
    }

    #subscription_info {
        div {
            display: flex;
            justify-content: space-between;
            font-size: 15px;
            margin-top: 10px;
            flex-wrap: wrap;

            label {
                width: 30%;
            }
            span {
                width: 60%;
                word-wrap: break-word;
                text-align: right;
            }
        }
    }
</style>
